﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Wijmo.master" AutoEventWireup="true" 
	CodeBehind="StackedPercentageBar.aspx.cs" Inherits="C1BarChart_StackedPercentageBar" %>
<%@ Register Assembly="C1.Web.Wijmo.Controls.3" namespace="C1.Web.Wijmo.Controls.C1Chart" tagPrefix="wijmo" %>

<asp:Content ID="Content1" ContentPlaceHolderID="Head" Runat="Server">
	<script type="text/javascript">
		function hintContent() {
			return this.data.label + '\n' + this.y + '';
		}
	</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
	<wijmo:C1BarChart runat = "server" Stacked="true" Is100Percent="true" ID="C1BarChart1" Height="475" Width = "756">
		<Hint>
			<Content Function="hintContent" />
		</Hint>
		<Axis>
			<Y Text="硬件总量" Compass="West"></Y>
			<X Text=""></X>
		</Axis>
		<Header Text="硬件分布"></Header>
		<SeriesStyles>
			<wijmo:ChartStyle Stroke="#afe500" Opacity="0.8">
				<Fill Color="#c3ff00"></Fill>
			</wijmo:ChartStyle>
			<wijmo:ChartStyle Stroke="#959595" Opacity="0.8">
				<Fill Color="#a6a6a6"></Fill>
			</wijmo:ChartStyle>
			<wijmo:ChartStyle Stroke="#2d2d2d" Opacity="0.8">
				<Fill Color="#333333"></Fill>
			</wijmo:ChartStyle>
		</SeriesStyles>
		<SeriesHoverStyles>
			<wijmo:ChartStyle StrokeWidth="1.5" Opacity="1" />
			<wijmo:ChartStyle StrokeWidth="1.5" Opacity="1" />
			<wijmo:ChartStyle StrokeWidth="1.5" Opacity="1" />
		</SeriesHoverStyles>
		<SeriesList>
			<wijmo:BarChartSeries Label="西部" LegendEntry="true">
				<Data>
					<X>
						<Values>
							<wijmo:ChartXData StringValue="台式机" />
							<wijmo:ChartXData StringValue="笔记本" />
							<wijmo:ChartXData StringValue="一体机" />
							<wijmo:ChartXData StringValue="平板电脑" />
							<wijmo:ChartXData StringValue="电话" />
						</Values>
					</X>
					<Y>
						<Values>
							<wijmo:ChartYData DoubleValue="5" />
							<wijmo:ChartYData DoubleValue="3" />
							<wijmo:ChartYData DoubleValue="4" />
							<wijmo:ChartYData DoubleValue="7" />
							<wijmo:ChartYData DoubleValue="2" />
						</Values>
					</Y>
				</Data>
			</wijmo:BarChartSeries>
			<wijmo:BarChartSeries Label="中部" LegendEntry="true">
				<Data>
					<X>
						<Values>
							<wijmo:ChartXData StringValue="台式机" />
							<wijmo:ChartXData StringValue="笔记本" />
							<wijmo:ChartXData StringValue="一体机" />
							<wijmo:ChartXData StringValue="平板电脑" />
							<wijmo:ChartXData StringValue="电话" />
						</Values>
					</X>
					<Y>
						<Values>
							<wijmo:ChartYData DoubleValue="2" />
							<wijmo:ChartYData DoubleValue="2" />
							<wijmo:ChartYData DoubleValue="3" />
							<wijmo:ChartYData DoubleValue="2" />
							<wijmo:ChartYData DoubleValue="1" />
						</Values>
					</Y>
				</Data>
			</wijmo:BarChartSeries>
			<wijmo:BarChartSeries Label="东部" LegendEntry="true">
				<Data>
					<X>
						<Values>
							<wijmo:ChartXData StringValue="台式机" />
							<wijmo:ChartXData StringValue="笔记本" />
							<wijmo:ChartXData StringValue="一体机" />
							<wijmo:ChartXData StringValue="平板电脑" />
							<wijmo:ChartXData StringValue="电话" />
						</Values>
					</X>
					<Y>
						<Values>
							<wijmo:ChartYData DoubleValue="3" />
							<wijmo:ChartYData DoubleValue="4" />
							<wijmo:ChartYData DoubleValue="4" />
							<wijmo:ChartYData DoubleValue="2" />
							<wijmo:ChartYData DoubleValue="5" />
						</Values>
					</Y>
				</Data>
			</wijmo:BarChartSeries>
		</SeriesList>
	</wijmo:C1BarChart>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="Description" Runat="Server">
	<p>
		<strong>C1BarChart </strong>不仅支持堆叠条形图，还可以用带有百分比的条形图显示出来。
	</p>
	<p>
		当<strong>Stacked</strong> 和
		<strong>Is100Percent</strong>的属性值为True时，启用带百分比的堆叠条形图。
	</p>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="ControlOptions" Runat="Server">
</asp:Content>

